// 第三方库
import {
  // BrowserRouter as Router,
  Router,
  Route,
  Switch,
  Redirect,
} from 'react-router-dom';

import { customHistory } from '@/utils';
import { isAuth } from '@/utils';

// 应用中组件
import { AuthRoute } from './components/AuthRoute';
import { Home } from '@/pages/Home/Home';
import { Test } from '@/pages/Test/Test';
import { Login } from '@/pages/Login/Login';
import { NotFound } from '@/pages/NotFound/NotFound';

// 导入组件样式
import './App.scss';

export const App = () => {
  return (
    // 传入我们自己定义的 history 对象
    <Router history={customHistory}>
      <div className="app">
        <Switch>
          {/* 应用中的组件 */}
          <Redirect exact path={'/'} to={'/home'} />
          {/* 要进行路由鉴权：使用 Route 的render属性 */}
          {/* <Route path={'/home'} component={Home} /> */}
          <Route
            path={'/home'}
            render={() => {
              // 判断用户是否登录
              if (isAuth()) {
                // 如果用户登录
                return <Home />;
              } else {
                // 如果用户未登录，重定向到登录页面
                return <Redirect to={'/login'} />;
              }
            }}
          />
          {/* <AuthRoute path={'/home'} component={Home} /> */}
          {/* <AuthRoute path={'/test'} component={Test} /> */}
          <Route path={'/login'} component={Login} />
          <Route component={NotFound} />
        </Switch>
      </div>
    </Router>
  );
};
